<template>
	<view class="container">
		<view class="top-top">
			<!--头部-->
			<view class="topbox">
				<view class="time">09:41</view>
				<view class="time-mod">
					<view class="signal">
						<image src="../../static/help/signal.png" mode=""></image>
					</view>
					<view class="wifi">
						<image src="../../static/help/Wifi.png" mode=""></image>
					</view>
					<view class="signal">
						<image src="../../static/help/signal.png" mode=""></image>
					</view>
				</view>
			</view>
			<!--选项卡-->
			<view class="nav" style="position: relative;">
				<view class="increase">
					<image src="../../static/help/increase.png" @click="show2 = !show2"></image>
				</view>
				<view class="addfriend" v-show="show2 == true">
					<view class="afone">
						<image src="../../static/help/scan.png" mode=""></image>
						<view>扫一扫</view>
					</view>
					<view class="aftwo" @click="toaddfriend()">
						<image src="../../static/help/scan.png" mode=""></image>
						<view>摇一摇</view>
					</view>
					<view class="afthree">
						<image src="../../static/help/scan.png" mode=""></image>
						<view>收付款</view>
					</view>
					<view class="affour">
						<image src="../../static/help/scan.png" mode=""></image>
						<view>小程序</view>
					</view>
					<view class="affive">
						<image src="../../static/help/friend.png" mode=""></image>
						<view>添加好友</view>
					</view>
				</view>
				<view class="nav-item">
					<view @click="value=0" :class="value==0?'orange':''">附近</view>
					<view @click="value=1" :class="value==1?'orange':''">关注</view>
					<view @click="value=2" :class="value==2?'orange':''">推荐</view>
				</view>
				<view class="search">
					<image src="../../static/help/path.png" mode=""></image>
				</view>
			</view>
			<!--列表-->
			<view class="list" v-show="value==1">
				<view class="card" style="margin-bottom: 37.4px;">
					<view class="card-left">
						<view class="wteacher">
							<image src="../../static/help/people.png" mode=""></image>
							<view class="woman2">
								<image src="../../static/help/woman.png" mode=""></image>
							</view>
						</view>
						<view class="private-chat">私聊</view>
					</view>
					<view class="card-center">
						<view class="wteacher-text">山村支教王老师</view>
						<view class="synopsis">
							<view>必要条件：<text>教师 认真 负责</text></view>
							我们这里是四川的山区，急需要更多有爱心的老师来山区支教~
						</view>
						<view class="fundraising">筹款：<text class="color-blue">¥800</text><text class="color-green">/8888</text>
						</view>
					</view>
					<view class="card-right">
						<view class="time">
							6分钟前·2.3km
						</view>
						<view class="contribute">
							<button class="contribute" @click="add();open()" v-show="!show">捐助</button>
							<button class="donated" @click="add();open()" v-show="show">已捐助</button>
						</view>
						<view class="bottom-mod">
							<view class="bottom-mod-left" @click="show6=true">
								<view class="chat-left">
									<image src="../../static/help/chat.png" mode=""></image>
								</view>
								<view class="chat-mod-num">384</view>
							</view>
							<!--弹出层部分-->
							<u-popup :show="show6" @close="close" :round="25">
								<view class="popup">
									<view class="comment">
										<view class="comment-num">1624条评论</view>
										<view class="close" @click="closeto">
											<image src="../../static/help/close.png" mode=""></image>
										</view>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">佳兴智能厨卫</view>
											<view class="comment-text">不做政治家的炮灰，挺好的，活着只要开
												心就好了！</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·广东</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>4.5w</view>
												</view>
											</view>
										</view>
									</view>
									<view class="expand">
										<view class="line"></view>
										<view class="expand-text">展开63条回复</view>
										<image src="../../static/help/select.png" mode=""></image>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people1.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">科比天下第一</view>
											<view class="comment-text">人生最最重要的就是开心,不是吗？</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·江苏</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>1702</view>
												</view>
											</view>
										</view>
									</view>
									<view class="reply-child">
										<view class="reply-child-top">
											<image src="../../static/help/people2.png" mode=""></image>
											<view class="reply-child-text">发布者昵称</view>
											<view class="reply-people">发布者</view>
										</view>
										<view class="reply-child-center">
											<view class="center-text">
												我们也要开心！
											</view>
											<view></view>
										</view>
										<view class="reply-child-bottom">
											<view class="bottom-left">
												<view class="bottom-left-item">昨天19：09·山西</view>
												<view class="bottom-reply">回复</view>
											</view>
											<view class="bottom-right">
												<image src="../../static/help/popup-zan.png"></image>
												<view>854</view>
											</view>
										</view>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people3.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">隔壁美女小丽</view>
											<view class="comment-text">大家一定要开心啊~~</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·湖北</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>752</view>
												</view>
											</view>
										</view>
									</view>
									<view class="expand">
										<view class="line"></view>
										<view class="expand-text">展开24条回复</view>
										<image src="../../static/help/select.png" mode=""></image>
									</view>
									<view class="more">
										暂时没有更多了
									</view>
									<view class="border-line"></view>
									<view class="input">
										<input type="text" placeholder="善语结善缘，恶言伤人心~">
										<image src="../../static/help/expression.png" mode=""></image>
									</view>
								</view>
								<view class="woman">
									<image src="../../static/help/woman.png" mode=""></image>
								</view>
								<view class="man">
									<image src="../../static/help/man.png" mode=""></image>
								</view>
								<view class="woman woman1">
									<image src="../../static/help/woman.png" mode=""></image>
								</view>
							</u-popup>
							<!--弹出层部分-->
							<view class="bottom-mod-right">
								<view class="chat-right">
									<image src="../../static/help/praise.png" mode=""></image>
								</view>
								<view class="chat-mod-zan">1.4w</view>
							</view>
						</view>
					</view>
				</view>
				<view class="card" style="margin-top: 8px;">
					<view class="card-left">
						<view class="wteacher">
							<image src="../../static/help/people.png" mode=""></image>
							<view class="woman2">
								<image src="../../static/help/woman.png" mode=""></image>
							</view>
						</view>
						<view class="private-chat">私聊</view>
					</view>
					<view class="card-center">
						<view class="wteacher-text">山村支教王老师</view>
						<view class="synopsis">
							<view>必要条件：<text>教师 认真 负责</text></view>
							我们这里是四川的山区，急需要更多有爱心的老师来山区支教~
						</view>
						<view class="fundraising">筹款：<text class="color-blue">¥800</text><text class="color-green">/8888</text>
						</view>
					</view>
					<view class="card-right">
						<view class="time">
							6分钟前·2.3km
						</view>
						<view class="contribute">
							<button class="contribute" @click="addone();open()" v-show="!show1">捐助</button>
							<button class="donated" @click="addone();open()" v-show="show1">已捐助</button>
						</view>
						<view class="bottom-mod">
							<view class="bottom-mod-left" @click="show6=true">
								<view class="chat-left">
									<image src="../../static/help/chat.png" mode=""></image>
								</view>
								<view class="chat-mod-num">384</view>
							</view>
							<!--弹出层部分-->
							<u-popup :show="show6" @close="close" :round="25">
								<view class="popup">
									<view class="comment">
										<view class="comment-num">1624条评论</view>
										<view class="close" @click="closeto">
											<image src="../../static/help/close.png" mode=""></image>
										</view>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">佳兴智能厨卫</view>
											<view class="comment-text">不做政治家的炮灰，挺好的，活着只要开
												心就好了！</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·广东</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>4.5w</view>
												</view>
											</view>
										</view>
									</view>
									<view class="expand">
										<view class="line"></view>
										<view class="expand-text">展开63条回复</view>
										<image src="../../static/help/select.png" mode=""></image>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people1.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">科比天下第一</view>
											<view class="comment-text">人生最最重要的就是开心,不是吗？</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·江苏</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>1702</view>
												</view>
											</view>
										</view>
									</view>
									<view class="reply-child">
										<view class="reply-child-top">
											<image src="../../static/help/people2.png" mode=""></image>
											<view class="reply-child-text">发布者昵称</view>
											<view class="reply-people">发布者</view>
										</view>
										<view class="reply-child-center">
											<view class="center-text">
												我们也要开心！
											</view>
											<view></view>
										</view>
										<view class="reply-child-bottom">
											<view class="bottom-left">
												<view class="bottom-left-item">昨天19：09·山西</view>
												<view class="bottom-reply">回复</view>
											</view>
											<view class="bottom-right">
												<image src="../../static/help/popup-zan.png"></image>
												<view>854</view>
											</view>
										</view>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people3.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">隔壁美女小丽</view>
											<view class="comment-text">大家一定要开心啊~~</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·湖北</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>752</view>
												</view>
											</view>
										</view>
									</view>
									<view class="expand">
										<view class="line"></view>
										<view class="expand-text">展开24条回复</view>
										<image src="../../static/help/select.png" mode=""></image>
									</view>
									<view class="more">
										暂时没有更多了
									</view>
									<view class="border-line"></view>
									<view class="input">
										<input type="text" placeholder="善语结善缘，恶言伤人心~">
										<image src="../../static/help/expression.png" mode=""></image>
									</view>
								</view>
								<view class="woman">
									<image src="../../static/help/woman.png" mode=""></image>
								</view>
								<view class="man">
									<image src="../../static/help/man.png" mode=""></image>
								</view>
								<view class="woman woman1">
									<image src="../../static/help/woman.png" mode=""></image>
								</view>
							</u-popup>
							<!--弹出层部分-->
							
							<view class="bottom-mod-right">
								<view class="chat-right">
									<image src="../../static/help/praise.png" mode=""></image>
								</view>
								<view class="chat-mod-zan">1.4w</view>
							</view>
						</view>
					</view>
				</view>
				<view class="card" style="margin-top: 8px;margin-bottom: 37.4px;">
					<view class="card-left">
						<view class="wteacher">
							<image src="../../static/help/people.png" mode=""></image>
							<view class="woman2">
								<image src="../../static/help/woman.png" mode=""></image>
							</view>
						</view>
						<view class="private-chat">私聊</view>
					</view>
					<view class="card-center">
						<view class="wteacher-text">山村支教王老师</view>
						<view class="synopsis">
							<view>必要条件：<text>教师 认真 负责</text></view>
							我们这里是四川的山区，急需要更多有爱心的老师来山区支教~
						</view>
						<view class="fundraising">筹款：<text class="color-blue">¥800</text><text class="color-green">/8888</text>
						</view>
					</view>
					<view class="card-right">
						<view class="time">
							6分钟前·2.3km
						</view>
						<view class="contribute">
							<button class="contribute" @click="addtwo();open()" v-show="!show3">捐助</button>
							<button class="donated" @click="addtwo();open()" v-show="show3">已捐助</button>
						</view>
						<view class="bottom-mod">
							<view class="bottom-mod-left" @click="show6=true">
								<view class="chat-left">
									<image src="../../static/help/chat.png" mode=""></image>
								</view>
								<view class="chat-mod-num">384</view>
							</view>
							<!--弹出层部分-->
							<u-popup :show="show6" @close="close" :round="25">
								<view class="popup">
									<view class="comment">
										<view class="comment-num">1624条评论</view>
										<view class="close" @click="closeto">
											<image src="../../static/help/close.png" mode=""></image>
										</view>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">佳兴智能厨卫</view>
											<view class="comment-text">不做政治家的炮灰，挺好的，活着只要开
												心就好了！</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·广东</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>4.5w</view>
												</view>
											</view>
										</view>
									</view>
									<view class="expand">
										<view class="line"></view>
										<view class="expand-text">展开63条回复</view>
										<image src="../../static/help/select.png" mode=""></image>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people1.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">科比天下第一</view>
											<view class="comment-text">人生最最重要的就是开心,不是吗？</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·江苏</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>1702</view>
												</view>
											</view>
										</view>
									</view>
									<view class="reply-child">
										<view class="reply-child-top">
											<image src="../../static/help/people2.png" mode=""></image>
											<view class="reply-child-text">发布者昵称</view>
											<view class="reply-people">发布者</view>
										</view>
										<view class="reply-child-center">
											<view class="center-text">
												我们也要开心！
											</view>
											<view></view>
										</view>
										<view class="reply-child-bottom">
											<view class="bottom-left">
												<view class="bottom-left-item">昨天19：09·山西</view>
												<view class="bottom-reply">回复</view>
											</view>
											<view class="bottom-right">
												<image src="../../static/help/popup-zan.png"></image>
												<view>854</view>
											</view>
										</view>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people3.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">隔壁美女小丽</view>
											<view class="comment-text">大家一定要开心啊~~</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·湖北</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>752</view>
												</view>
											</view>
										</view>
									</view>
									<view class="expand">
										<view class="line"></view>
										<view class="expand-text">展开24条回复</view>
										<image src="../../static/help/select.png" mode=""></image>
									</view>
									<view class="more">
										暂时没有更多了
									</view>
									<view class="border-line"></view>
									<view class="input">
										<input type="text" placeholder="善语结善缘，恶言伤人心~">
										<image src="../../static/help/expression.png" mode=""></image>
									</view>
								</view>
								<view class="woman">
									<image src="../../static/help/woman.png" mode=""></image>
								</view>
								<view class="man">
									<image src="../../static/help/man.png" mode=""></image>
								</view>
								<view class="woman woman1">
									<image src="../../static/help/woman.png" mode=""></image>
								</view>
							</u-popup>
							<!--弹出层部分-->
							<view class="bottom-mod-right">
								<view class="chat-right">
									<image src="../../static/help/praise.png" mode=""></image>
								</view>
								<view class="chat-mod-zan">1.4w</view>
							</view>
						</view>
					</view>
				</view>
				<view class="card" style="margin-top: 8px;">
					<view class="card-left">
						<view class="wteacher">
							<image src="../../static/help/people.png" mode=""></image>
							<view class="woman2">
								<image src="../../static/help/woman.png" mode=""></image>
							</view>
						</view>
						<view class="private-chat">私聊</view>
					</view>
					<view class="card-center">
						<view class="wteacher-text">山村支教王老师</view>
						<view class="synopsis">
							<view>必要条件：<text>教师 认真 负责</text></view>
							我们这里是四川的山区，急需要更多有爱心的老师来山区支教~
						</view>
						<view class="fundraising">筹款：<text class="color-blue">¥800</text><text class="color-green">/8888</text>
						</view>
					</view>
					<view class="card-right">
						<view class="time">
							6分钟前·2.3km
						</view>
						<view class="contribute">
							<button class="contribute" @click="addthree();open()" v-show="!show4">捐助</button>
							<button class="donated" @click="addthree();open()" v-show="show4">已捐助</button>
						</view>
						<view class="bottom-mod">
							<view class="bottom-mod-left" @click="show6=true">
								<view class="chat-left">
									<image src="../../static/help/chat.png" mode=""></image>
								</view>
								<view class="chat-mod-num">384</view>
							</view>
							<!--弹出层部分-->
							<u-popup :show="show6" @close="close" :round="25">
								<view class="popup">
									<view class="comment">
										<view class="comment-num">1624条评论</view>
										<view class="close" @click="closeto">
											<image src="../../static/help/close.png" mode=""></image>
										</view>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">佳兴智能厨卫</view>
											<view class="comment-text">不做政治家的炮灰，挺好的，活着只要开
												心就好了！</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·广东</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>4.5w</view>
												</view>
											</view>
										</view>
									</view>
									<view class="expand">
										<view class="line"></view>
										<view class="expand-text">展开63条回复</view>
										<image src="../../static/help/select.png" mode=""></image>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people1.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">科比天下第一</view>
											<view class="comment-text">人生最最重要的就是开心,不是吗？</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·江苏</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>1702</view>
												</view>
											</view>
										</view>
									</view>
									<view class="reply-child">
										<view class="reply-child-top">
											<image src="../../static/help/people2.png" mode=""></image>
											<view class="reply-child-text">发布者昵称</view>
											<view class="reply-people">发布者</view>
										</view>
										<view class="reply-child-center">
											<view class="center-text">
												我们也要开心！
											</view>
											<view></view>
										</view>
										<view class="reply-child-bottom">
											<view class="bottom-left">
												<view class="bottom-left-item">昨天19：09·山西</view>
												<view class="bottom-reply">回复</view>
											</view>
											<view class="bottom-right">
												<image src="../../static/help/popup-zan.png"></image>
												<view>854</view>
											</view>
										</view>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people3.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">隔壁美女小丽</view>
											<view class="comment-text">大家一定要开心啊~~</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·湖北</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>752</view>
												</view>
											</view>
										</view>
									</view>
									<view class="expand">
										<view class="line"></view>
										<view class="expand-text">展开24条回复</view>
										<image src="../../static/help/select.png" mode=""></image>
									</view>
									<view class="more">
										暂时没有更多了
									</view>
									<view class="border-line"></view>
									<view class="input">
										<input type="text" placeholder="善语结善缘，恶言伤人心~">
										<image src="../../static/help/expression.png" mode=""></image>
									</view>
								</view>
								<view class="woman">
									<image src="../../static/help/woman.png" mode=""></image>
								</view>
								<view class="man">
									<image src="../../static/help/man.png" mode=""></image>
								</view>
								<view class="woman woman1">
									<image src="../../static/help/woman.png" mode=""></image>
								</view>
							</u-popup>
							<!--弹出层部分-->
							<view class="bottom-mod-right">
								<view class="chat-right">
									<image src="../../static/help/praise.png" mode=""></image>
								</view>
								<view class="chat-mod-zan">1.4w</view>
							</view>
						</view>
					</view>
				</view>
				<view class="card" style="margin-top: 8px;">
					<view class="card-left">
						<view class="wteacher">
							<image src="../../static/help/people.png" mode=""></image>
							<view class="woman2">
								<image src="../../static/help/woman.png" mode=""></image>
							</view>
						</view>
						<view class="private-chat">私聊</view>
					</view>
					<view class="card-center">
						<view class="wteacher-text">山村支教王老师</view>
						<view class="synopsis">
							<view>必要条件：<text>教师 认真 负责</text></view>
							我们这里是四川的山区，急需要更多有爱心的老师来山区支教~
						</view>
						<view class="fundraising">筹款：<text class="color-blue">¥800</text><text class="color-green">/8888</text>
						</view>
					</view>
					<view class="card-right">
						<view class="time">
							6分钟前·2.3km
						</view>
						<view class="contribute">
							<button class="contribute" @click="addfour();open()" v-show="!show5">捐助</button>
							<button class="donated" @click="addfour();open()" v-show="show5">已捐助</button>
						</view>
						<view class="bottom-mod">
							<view class="bottom-mod-left" @click="show6=true">
								<view class="chat-left">
									<image src="../../static/help/chat.png" mode=""></image>
								</view>
								<view class="chat-mod-num">384</view>
							</view>
							<!--弹出层部分-->
							<u-popup :show="show6" @close="close" :round="25">
								<view class="popup">
									<view class="comment">
										<view class="comment-num">1624条评论</view>
										<view class="close" @click="closeto">
											<image src="../../static/help/close.png" mode=""></image>
										</view>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">佳兴智能厨卫</view>
											<view class="comment-text">不做政治家的炮灰，挺好的，活着只要开
												心就好了！</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·广东</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>4.5w</view>
												</view>
											</view>
										</view>
									</view>
									<view class="expand">
										<view class="line"></view>
										<view class="expand-text">展开63条回复</view>
										<image src="../../static/help/select.png" mode=""></image>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people1.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">科比天下第一</view>
											<view class="comment-text">人生最最重要的就是开心,不是吗？</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·江苏</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>1702</view>
												</view>
											</view>
										</view>
									</view>
									<view class="reply-child">
										<view class="reply-child-top">
											<image src="../../static/help/people2.png" mode=""></image>
											<view class="reply-child-text">发布者昵称</view>
											<view class="reply-people">发布者</view>
										</view>
										<view class="reply-child-center">
											<view class="center-text">
												我们也要开心！
											</view>
											<view></view>
										</view>
										<view class="reply-child-bottom">
											<view class="bottom-left">
												<view class="bottom-left-item">昨天19：09·山西</view>
												<view class="bottom-reply">回复</view>
											</view>
											<view class="bottom-right">
												<image src="../../static/help/popup-zan.png"></image>
												<view>854</view>
											</view>
										</view>
									</view>
									<view class="popup-comtent">
										<view class="head-sculpture">
											<image src="../../static/help/people3.png"></image>
										</view>
										<view class="comment-item">
											<view class="comment-name">隔壁美女小丽</view>
											<view class="comment-text">大家一定要开心啊~~</view>
											<view class="location">
												<view class="location-left">
													<view class="location-left-item">昨天19：09·湖北</view>
													<view class="location-reply">回复</view>
												</view>
												<view class="location-right">
													<image src="../../static/help/popup-zan.png"></image>
													<view>752</view>
												</view>
											</view>
										</view>
									</view>
									<view class="expand">
										<view class="line"></view>
										<view class="expand-text">展开24条回复</view>
										<image src="../../static/help/select.png" mode=""></image>
									</view>
									<view class="more">
										暂时没有更多了
									</view>
									<view class="border-line"></view>
									<view class="input">
										<input type="text" placeholder="善语结善缘，恶言伤人心~">
										<image src="../../static/help/expression.png" mode=""></image>
									</view>
								</view>
								<view class="woman">
									<image src="../../static/help/woman.png" mode=""></image>
								</view>
								<view class="man">
									<image src="../../static/help/man.png" mode=""></image>
								</view>
								<view class="woman woman1">
									<image src="../../static/help/woman.png" mode=""></image>
								</view>
							</u-popup>
							<!--弹出层部分-->
							<view class="bottom-mod-right">
								<view class="chat-right">
									<image src="../../static/help/praise.png" mode=""></image>
								</view>
								<view class="chat-mod-zan">1.4w</view>
							</view>
						</view>
					</view>
				</view>
			</view>

		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: false,
				show1: false,
				show2: false,
				show3: false,
				show4: false,
				show5: false,
				href: 'https://uniapp.dcloud.io/component/README?id=uniui',
				value: 1,
				show6: false
			}
		},
		methods: {
			add() {
				this.friend = '已添加',
					this.show = !this.show
			},
			addone() {
				this.friend = '已添加',
					this.show1 = !this.show1
			},
			addtwo() {
				this.friend = '已添加',
					this.show3 = !this.show3
			},
			addthree() {
				this.friend = '已添加',
					this.show4 = !this.show4
			},
			addfour() {
				this.friend = '已添加',
					this.show5 = !this.show5
			},
			open() {
				uni.showToast({
					title: '已捐助',
					icon: 'none',
					duration: 2000
				})
			},
			close() {
				this.show6 = false
			},
			closeto() {
				this.show6 = false
			}
		}
	}
</script>

<style lang="scss">
	.container {
		padding: 7px;
		font-size: 14px;
		line-height: 24px;

		.top-top {
			background-color: rgb(245, 245, 245);
		}

		.topbox {
			width: 95%;
			height: var(--status-bar-height);
			margin: 0 auto;
			height: 18px;
			display: flex;
			justify-content: space-between;

			.time {}

			.time-mod {
				display: flex;

				.signal {
					image {
						width: 17px;
						height: 10px;
					}
				}

				.wifi {
					image {
						margin: 0 5px;
						width: 15px;
						height: 11px;
					}
				}
			}
		}

		.nav {
			display: flex;
			margin-top: 35px;

			.increase {


				image {
					width: 26px;
					height: 26px;

				}
			}

			.addfriend {
				position: absolute;
				top: 80rpx;
				background-color: #505050;
				width: 240rpx;
				border-radius: 20rpx;
				z-index: 999;

				.afone {
					color: white;
					height: 50%;
					width: 100%;
					// text-align: center;
					font-size: 30rpx;
					line-height: 100rpx;
					border-bottom: solid #F5F5F5 2rpx;
					display: flex;

					image {
						margin: 0 13px;
						margin-top: 14.55px;
						width: 20.71px;
						height: 20.71px;
					}
				}

				.aftwo {
					color: white;
					height: 50%;
					width: 100%;
					text-align: center;
					font-size: 30rpx;
					line-height: 100rpx;
					border-bottom: solid #F5F5F5 2rpx;
					display: flex;

					image {
						margin: 0 13px;
						margin-top: 14.55px;
						width: 20.71px;
						height: 20.71px;
					}
				}

				.afthree {
					color: white;
					height: 50%;
					width: 100%;
					text-align: center;
					font-size: 30rpx;
					line-height: 100rpx;
					background-color: #505050;
					border-radius: 20rpx;
					border-bottom: solid #F5F5F5 2rpx;
					display: flex;

					image {
						margin: 0 13px;
						margin-top: 14.55px;
						width: 20.71px;
						height: 20.71px;
					}
				}

				.affour {
					color: white;
					height: 50%;
					width: 100%;
					text-align: center;
					font-size: 30rpx;
					line-height: 100rpx;
					background-color: #505050;
					border-radius: 20rpx;
					border-bottom: solid #F5F5F5 2rpx;
					display: flex;

					image {
						margin: 0 13px;
						margin-top: 14.55px;
						width: 20.71px;
						height: 20.71px;
					}
				}

				.affive {
					color: white;
					height: 50%;
					width: 100%;
					text-align: center;
					font-size: 30rpx;
					line-height: 100rpx;
					background-color: #505050;
					border-radius: 20rpx;
					border-bottom: solid #F5F5F5 2rpx;
					display: flex;

					image {
						margin: 0 13px;
						margin-top: 14.55px;
						width: 20.71px;
						height: 20.71px;
					}
				}
			}

			.nav-item {
				width: 184px;
				height: 33px;
				margin: auto;
				display: flex;
				font-size: 20px;

				.orange {
					color: rgb(255, 42, 49);
					border-bottom: 4px solid rgb(255, 42, 49);
				}

				view {
					margin: 0 10px;
				}
			}

			.search {
				image {
					width: 24px;
					height: 24px;

				}
			}
		}

		.list {
			height: 800.81px;
			margin-top: 22px;

			.card {
				background-color: #fff;
				height: 142px;
				border-radius: 12px;
				display: flex;

				.card-left {

					.wteacher {
						position: relative;
						margin: 13px 12px 18px 12px;

						image {
							width: 46px;
							height: 46px;
						}
						.woman2{
							position: absolute;
							top: 40px;
							right: 35px;
							width: 15px;
							height: 15px;
							border-radius: 50%;
							background-color: rgb(255, 77, 148);
							image{
								width: 7.5px;
								height: 7.52px;
								margin-bottom: 6px;
								margin-left: 3px;
							}
						}
					}

					.private-chat {
						margin: 0 0 0 12px;
						width: 46px;
						height: 22px;
						border: 1px solid rgb(255, 42, 49);
						border-radius: 88px;
						text-align: center;
						color: rgb(255, 42, 49);
					}
				}

				.card-center {
					.wteacher-text {
						width: 98px;
						margin: 13px 0 0 0;
						color: rgb(150, 150, 150);
					}

					.synopsis {
						width: 196px;

						text {
							color: rgb(255, 42, 49);
						}
					}

					.fundraising {
						font-size: 16px;
						margin: 11px 0 4px 0;

						.color-blue {
							color: rgb(0, 150, 250);
						}

						.color-green {
							color: rgb(7, 193, 96);
						}
					}
				}

				.card-right {
					.time {
						color: rgb(200, 200, 200);
						width: 84px;
						margin: 0 11px;
						font-size: 12px;
						margin: 7.6px 0 0 0;
					}

					.contribute {
						button {
							background-color: rgb(255, 42, 49);
							color: #fff;
							width: 70px;
							height: 30px;
							font-size: 16px;
							text-align: center;
							line-height: 30px;
							margin-top: 29.4px;
						}

						.donated {
							font-size: 14px;
						}
					}

					.bottom-mod {
						margin: 26px 0 7px 0;
						display: flex;
						width: 96px;

						.bottom-mod-left {
							margin-right: 10px;
							display: flex;

							.chat-left {
								width: 12.8px;
								height: 13.16px;
								margin-top: 2px;

								image {
									width: 12.8px;
									height: 13.16px;
								}
							}

							.chat-mod-num {
								font-size: 12px;

							}
						}

						.bottom-mod-right {
							display: flex;
							margin-right: 12px;

							.chat-right {
								margin-top: 2px;

								image {
									width: 14px;
									height: 13.39px;
								}
							}

							.chat-mod-zan {
								font-size: 12px;
							}
						}
					}
				}
			}
		}
	}

	//弹出层
	.popup {

		.comment {
			margin: 16px 0 0 0;
			width: 100%;
			display: flex;
			justify-content: center;

			.close {
				image {
					position: absolute;
					top: 19.42px;
					right: 17.42px;
					width: 15.16px;
					height: 15.16px;
				}
			}
		}

		.popup-comtent {
			display: flex;
			margin: 19px 24px 0 15px;


			.head-sculpture {
				position: relative;

				image {
					width: 46px;
					height: 46px;
					margin-left: 4px;
				}
			}

			.comment-item {
				.comment-name {
					color: rgb(150, 150, 150);
					margin-left: 30rpx;
				}

				.comment-text {
					margin-left: 30rpx;
					font-size: 34rpx;
				}

				.location {
					display: flex;
					justify-content: space-between;

					.location-left {
						display: flex;

						.location-left-item {
							margin-left: 30rpx;
							color: rgb(150, 150, 150);
						}

						.location-reply {
							margin-left: 44rpx;
							color: rgb(100, 100, 100);
						}
					}

					.location-right {
						color: rgb(100, 100, 100);
						display: flex;
						margin-left: 61px;

						image {
							margin-top: 5px;
							margin-right: 6px;
							width: 14px;
							height: 13.39px;
						}
					}
				}
			}
		}

		.expand {
			display: flex;

			.line {
				margin: 28px 0 0 85px;
				width: 30px;
				height: 0px;
				border: 1px solid rgb(200, 200, 200);
			}

			.expand-text {
				margin: 15px 3px 0 3px;
			}

			image {
				width: 11.4px;
				height: 6.67px;
				margin-top: 23px;
			}
		}

		.reply-child {
			margin-right: 24px;

			.reply-child-top {
				display: flex;

				image {
					width: 30px;
					height: 30px;
					margin-left: 80px;
				}

				.reply-child-text {
					margin-left: 7px;
					color: rgb(150, 150, 150);
				}

				.reply-people {
					width: 50px;
					height: 16px;
					line-height: 16px;
					background-color: rgb(255, 42, 49);
					color: #fff;
					border: 1px solid;
					text-align: center;
					margin-top: 2px;
					margin-left: 7px;
				}
			}

			.reply-child-center {
				.center-text {
					margin-left: 117px;
					font-size: 18px;
				}
			}

			.reply-child-bottom {
				display: flex;
				justify-content: space-between;

				.bottom-left {
					display: flex;

					.bottom-left-item {
						margin-left: 117px;
					}

					.bottom-reply {
						margin-left: 22px;
					}
				}

				.bottom-right {
					display: flex;

					image {
						width: 14px;
						height: 13.39px;
						margin-top: 5px;
						margin-right: 6px;
					}
				}
			}
		}

		.more {
			text-align: center;
			margin-top: 15px;
			margin-bottom: 19.87px;
			color: rgb(150, 150, 150);
		}

		.border-line {
			width: 100%;
			height: 0px;
			border: 1px solid rgb(235, 235, 235);
		}

		.input {
			position: relative;

			input {
				margin: 9px 13px 0 11px;
				margin-bottom: 10px;
				height: 48px;
				background-color: rgb(255, 255, 255);
				border-radius: 88px;
				padding: 0 16px;
			}

			image {
				position: absolute;
				top: 9px;
				right: 27px;
				width: 29.75px;
				height: 29.75px;
			}
		}

	}

	.woman,
	{
	position: absolute;
	top: 95px;
	left: 15px;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-color: rgb(255, 77, 148);

	image {
		width: 7.5px;
		height: 7.52px;
		margin-bottom: 6px;
		margin-left: 2px;
	}
	}

	.man {
		position: absolute;
		top: 254px;
		left: 15px;
		width: 12px;
		height: 12px;
		border-radius: 50%;
		background-color: rgb(118, 154, 255);

		image {
			width: 7.5px;
			height: 7.52px;
			margin-bottom: 6px;
			margin-left: 2px;
		}
	}

	.woman1 {
		top: 420px;
	}
	
</style>